import React from 'react';
import{Axis,Geom,Tooltip,Chart, Coord, Label, Legend, View, Guide, Shape} from 'bizcharts'

import './style.css'

class ChartDemo extends React.PureComponent {

  render() {
    //     const data = [
    // { year: '1月', sales: 38 },
    // { year: '2月', sales: 52 },
    // { year: '3月', sales: 61 },
    // { year: '4月', sales: 14 },
    // { year: '5月', sales: 48 },
    // { year: '6月', sales: 38 },
    // { year: '7月', sales: 28 },
    // { year: '8月', sales: 18 },
    // { year: '9月', sales: 46},
    // { year: '10月', sales: 19 },
    // { year: '11月', sales: 51 },
    // { year: '12月', sales: 21 },
    // ];
    // const cols = {
    // 'sales': {tickInterval: 100},
    // };

    return (
      <div>
        <div className="char-top">
          <div className="Chart-top-item">
            <div className="sale-tit">总销售额</div>
            <div className="sale-sum-amount">￥124,421</div>
            <div className="sale-float">
                <div className="sale-week">周同比<span>12%<i>↑</i></span></div>
                <div className="sale-day">日环比<span>11%<i>↓</i></span></div>
            </div>
            <div className="sale-avg-amount"><span>日均销售额</span><span>￥12,565</span></div>
          </div>
          <div className="Chart-top-item">
            <div className="sale-tit">访问量</div>
            <div className="sale-sum-amount">8989</div>
            <div className="chart-view">可视图表</div>
            <div className="sale-avg-amount"><span>日访问量</span><span>12,565</span></div>
          </div>
          <div className="Chart-top-item">
            <div className="sale-tit">支付笔数</div>
            <div className="sale-sum-amount">13342</div>
            <div className="chart-view">可视图表</div>
            <div className="sale-avg-amount"><span>转化率</span><span>88%</span></div>
          </div>
          <div className="Chart-top-item">
            <div className="sale-tit">运营活动效果</div>
            <div className="sale-sum-amount">89%</div>
            <div className="chart-view">可视图表</div>
            <div className="sale-avg-amount">
              <div className="sale-week">周同比<span>12%<i>↑</i></span></div>
              <div className="sale-day">日环比<span>11%<i>↓</i></span></div>
            </div>
          </div>
        </div>
        <div>

        </div>
      </div>
    )
  }

}

export default ChartDemo
